/**
 * 
 * @authors kroyo
 * @date    2017-09-05 00:08:01
 * @version 1.0.0
 * 日期控件
 */


datePicker('.tran-date .select','.date-wrap');
var dateArr = [];
var year,month,day ;
function datePicker(sel,datesel){

    //触发点击事件的对象
	var $select = $(sel);
	//显示选择视图
	var $text = $(sel+' .text');
	// 1.定义下拉列表框 变量
	var $date = $(datesel);
	var $datelist = $(datesel+' ul');

	// 2.定义 year
	var $year = $(datesel+' .year');
	// 3.定义 month
	var $month = $(datesel+' .month');

	var nowyear = new Date().getFullYear();
	//时间年  1970-现在
	datelist($year,nowyear,1970);
	//时间月  1-12月
	datelist($month,12,1);
    

    // 弹出时间下拉框
	$select.on('click',function(event){
		pudownList($date);
		event.stopPropagation();
	});
	addActive(datesel,' .year',true);

    //判断是否存在日选项
	if($datelist.length<=2){
		addActive(datesel,' .month',false);
		selectDate(false);
	}else{
		addActive(datesel,' .month',true);
        if(year>0&&month>0){
        	var $day = $(datesel+' .day');
        	datelist($day,dayNum((year+1),(month+1)),1);
        	addActive(datesel,' .day',false);
        }
		selectDate(true);
	}
    
    //点击文档其他位置时，收起弹框
	$(document).click(function(e){
		ondate = false;
		animated($date,ondate);
		ondate = true;
	});
}
//生成日期时间选项 
function datelist($sel,max,min){
	$sel.children().remove();
	for(var i = min;i<max;i++){
		$sel.append('<li>'+i+'</li>');
	}
}
// 下拉列表选项
function addActive(datesel,sel,off){
	var $dateli = $(datesel+sel+' li');
	$dateli.on('click',function(event){
		$dateli.removeClass('active');
		$(this).addClass('active');
		if(off){
			event.stopPropagation();
			return $(this).index();
		}
	})
}
//获取选择的时间日期
function selectDate(off){
	//清空数组
	var $yearli = $('.tran-date .year li');
	var $monthli = $('.tran-date .month li');

	var textArr = [];

	for(var i = 0;i<$yearli.length;i++){
		if($yearli.eq(i).hasClass('active')){
			dateArr.push(i);
			textArr.push($yearli.eq(i).text());
			break;
		}
	}
	for(var i = 0;i<$monthli.length;i++){
		if($yearli.eq(i).hasClass('active')){
			dateArr.push(i);
			textArr.push($yearli.eq(i).text());
			break;
		}
	}

	//判断是否存在日期选项
	if(off){
		var $dayli = $('.tran-date .day li');
		for(var i = 0;i<$dayli.length;i++){
			if($yearli.eq(i).hasClass('active')){
				dateArr.push(i);
				textArr.push($yearli.eq(i).text());
				break;
			}
		}
	}

	return dateArr;
}
var ondate = true;
function pudownList($date){
	animated($date,ondate);
	if(ondate){
		ondate = false;
	}else{
		ondate = true;
	}
}
//下拉列表下拉与收缩的动画
function animated($list,off){
	if(off){
		$list.slideDown();
	}else{
		$list.slideUp();
	}
}

//判断当前月份的天数
function dayNum(year,mouth){
    var cond1 = year % 4 == 0;  //条件1：年份必须要能被4整除
    var cond2 = year % 100 != 0;  //条件2：年份不能是整百数
    var cond3 = year % 400 ==0;  //条件3：年份是400的倍数
    var cond = (cond1 && cond2) || cond3;
    if(mouth==1||mouth==3||mouth==5||mouth==7||mouth==8||mouth==10||mouth==12){
        day = 31;
    }
    if(mouth==4||mouth==6||mouth==9||mouth==11){
        day = 30;
    }
    if(cond){
        if(mouth==2){
            day = 29;
        }
    }else{
        if(mouth==2){
            day = 28;
        }
    }
    return day;
}






//下拉列表
function clickfun(sel){
	var $select = $(sel);
	//显示选择视图
	var $text = $(sel+' .text');
	// 1.定义下拉列表框变量
	var $list = $(sel+' +.selectdown');
	// 2.定义下拉列表选项
	var $li = $(sel+' +.selectdown li');

	$select.on('click',function(event){
		$(this).toggleClass('active');
		pudownList($list);

		//选择选项
		addActive($li,$text);

		event.stopPropagation();
	})

    //点击文档其他位置时，收起弹框
	$(document).click(function(e){
		ondown = false;
		$select.removeClass('active');
		animated($list,ondown);
		ondown = true;
	});
}

var ondown = true;
function pudownList($list){
	if(ondown){
		animated($list,ondown);
		ondown = false;
	}else{
		animated($list,ondown);
		ondown = true;
	}
}
// 下拉列表选项
function addActive($li,$text){
	$li.on('click',function(){
		$li.removeClass('active');
		$(this).addClass('active');
		$text.text($(this).text());
	})
}
//下拉列表下拉与收缩的动画
function animated($list,off){
	if(off){
		$list.slideDown();
	}else{
		$list.slideUp();
	}
}






//未保存,则回到原来状态
function changeDate(){
	var $list = $('#container-other .date-wrap li');
	$list.removeClass('active');
    //首先清空所有active
    if(dateArr.length>0){

        var a = dateArr[0],b= dateArr[1];

        var $year = $('#container-other .date-wrap .year');
        var $yearli = $('.date-wrap .year li');
		var $monthli = $('.date-wrap .month li');

        var height = $yearli.eq(a).height();

        $yearli.eq(a).addClass('active');
        $monthli.eq(b).addClass('active');
        $year.scrollTop(height*(a-3));
        $month.scrollTop(height*b);

        //展开所有选项卡
        $month.css('display','block');

        return true;
    }else{
    	$month.css('display','none');
    }
}






//2.时间日期列表
var dateArr = [];
var year,month,day ;
function datePicker(datesel){
	// 2.定义 year
	var $year = $(datesel+' .year');
	// 3.定义 month
	var $month = $(datesel+' .month');

	var nowyear = new Date().getFullYear();
	//时间年  1970-现在
	datelist($year,nowyear,1970,'年');
	//时间月  1-12月
	datelist($month,12,1,'月');


    scroll('.date-wrap .year');
    scroll('.date-wrap .month');
}
//生成日期时间选项 
function datelist($sel,max,min,text){
	for(var i = min;i<=max;i++){
		$sel.append('<li>'+i+text+'</li>');
	}
}
var ondate = true;
function pudownList($date){
	animated($date,ondate);
	if(ondate){
		ondate = false;
	}else{
		ondate = true;
		changeDate();
	}
}








//获取选择的时间日期
function selectDate(){
	//清空数组
	dateArr.length = 0;
	
	var $yearli = $('.date-wrap .year li');
	var $monthli = $('.date-wrap .month li');
	var $dateText = $('.tran-date .text');

	var textArr = [];

	for(var i = 0;i<$yearli.length;i++){
		if($yearli.eq(i).hasClass('active')){
			dateArr.push(i);
			textArr.push($yearli.eq(i).text());
			break;
		}
	}
	for(var i = 0;i<$monthli.length;i++){
		if($monthli.eq(i).hasClass('active')){
			dateArr.push(i);
			textArr.push($monthli.eq(i).text());
			break;
		}
	}
	$dateText.val(textArr[0]+textArr[1]);
	return dateArr;
}

clickAdd('.year');
clickAdd('.month');
function clickAdd(sel){
	var $dateli = $($('.date-wrap '+sel+' li'));
	$dateli.on('click',function(){
		$dateli.removeClass('active');
		$(this).addClass('active');
		if(sel=='.month'){
			selectDate();
		}
	})
}